import React from 'react';
import { Menu, Sidebar, Icon } from "semantic-ui-react";
import { MENUITEMS } from '../../constant/index';
import './sidebarMenu.css';
export const SidebarMenu=()=>{
    return (<div>
                        <Sidebar as={Menu} animation="push" inverted vertical visible className="sidebar-menu">
                <Menu.Item className="sidebar-menu-item"> </Menu.Item>
                {MENUITEMS.map((item) => (
                    <React.Fragment key={item.name}>
                        {item.level === 0 && (
                            <Menu.Item as="a" name={item.name} className="sidebar-menu-item">
                                <span className="icon-wrapper">
                                    <Icon name={item.icon} />
                                </span>
                                <span>{item.label}</span>
                            </Menu.Item>
                        )}
                    </React.Fragment>
                ))}
            </Sidebar>
</div>
)
}

